<template>
	<view class="wp">
		<view class="s_href" @click="$navTo('/pages/userservice/regionList')">服务明细></view>
		<!-- <view class="s_input">
			<uni-data-checkbox v-model="level" :localdata="levelList" @change="changeLevel"></uni-data-checkbox>
		</view>
		<uni-data-picker v-if="level==1" placeholder="请选择省" popup-title="请选择" :map="{text:'areaname',value:'id'}" :localdata="provinceList" v-model="provinceId" @change="onchangeJy"></uni-data-picker>
		<uni-data-picker v-if="level==2" placeholder="请选择省市" popup-title="请选择" :localdata="addressAreaList" v-model="cityId" @change="onchangeJy"></uni-data-picker>
		<uni-data-picker v-if="level==3" placeholder="请选择省市区/县" popup-title="请选择" :localdata="addressList" v-model="areaId" @change="onchangeJy"></uni-data-picker> -->
		<view class="s_input">
			<label for="">缴费金额：</label>
			<input type="number" v-model="money" placeholder="请输入已缴纳金额">
		</view>
		<view class="s_input">
			<label for="">分公司：</label>
			<input type="text" v-model="company_name" placeholder="请输入分公司名称进行搜索">
			<view class="s_query" @click="queryBranch">查询</view>
		</view>
		<view class="query_result" v-if="branchList&&branchList.length>0">
			<view class="q_tit">请点击分公司进行选择</view>
			<view class="q_content q_branch" :class="{'q_content_ac':item.id==companyId}" v-for="item in branchList" @click="selectBranch(item.id)">
				<image v-if="item.id==companyId" class="q_select" src="https://img.jinghushi.com/images/9/2025/04/Lb5K6O26fobJK3cldOdWdjtlJ7LBdL.png"></image>
				<view class="q_head">分公司名称：{{item.company_name}}</view>
				<view class="q_head">管辖区域：{{item.all_address_name}}</view>
				<view class="flex_between">
					<image :src="item.logo"></image>
					<view class="q_info">
						<view>店铺：{{item.supname}}</view>
						<view>电话：{{item.principalmobile}}</view>
						<view>地址：{{item.address_name}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="s_input">
			<label for="">会员ID：</label>
			<input type="number" v-model="memberId" placeholder="请输入会员ID">
			<view class="s_query" @click="queryMember">查询</view>
		</view>
		<view class="query_result" v-if="info.memberInfo.id">
		<!-- <view class="query_result"> -->
			<view class="q_tit">查询结果如下</view>
			<view class="q_head">用户信息</view>
			<view class="q_content">
				<view class="flex_between">
					<image :src="info.memberInfo.avatar"></image>
					<view class="q_info">
						<view>姓名：{{info.memberInfo.nickname}}</view>
						<view>ID：{{info.memberInfo.id}}</view>
						<view>电话：{{info.memberInfo.mobile}}</view>
					</view>
				</view>
			</view>
			<view class="q_head" v-if="info.agentInfo.id">推荐人</view>
			<view class="q_content" v-if="info.agentInfo.id">
				<view class="flex_between">
					<image :src="info.agentInfo.avatar"></image>
					<view class="q_info">
						<view>姓名：{{info.agentInfo.nickname}}</view>
						<view>ID：{{info.agentInfo.id}}</view>
						<view>电话：{{info.agentInfo.mobile}}</view>
					</view>
				</view>
			</view>
			<view class="q_head">划拨明细</view>
			<view class="q_content">
				<view class="flex_between" style="align-items: flex-start;">
					<view class="q_info">
						<view>区域公司：{{info.calculate.region_money}}</view>
						<!-- <view>大区公司：{{info.calculate.upper_region_money}}</view> -->
						<view>管理津贴：{{info.calculate.manage_money}}</view>
					</view>
					<view class="q_info">
						<view>推荐人佣金：{{info.calculate.agent_money}}</view>
						<view>待补贴金额：{{info.calculate.md_money}}</view>
						<!-- <view>公司：{{info.calculate.dmj_money}}</view> -->
					</view>
				</view>
			</view>
		</view>
		<view class="s_input">
			<label for="">持股比例：</label>
			<input type="number" v-model="stock" placeholder="请输入持股比例">
			<label for="">%</label>
			<view class="s_query" style="width: 188rpx;margin-left:10rpx" @click="queryStock">可分配股权</view>
		</view>
		<view class="s_input">
			<label for="">姓名：</label>
			<input type="number" v-model="real_name" placeholder="请输入真实姓名">
		</view>
		<view class="s_input">
			<label for="">身份证号：</label>
			<input type="number" v-model="id_card_number" placeholder="请输入身份证号">
		</view>
		<view class="totalBtn" @click="submit">确认</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				memberId: '',
				info: [],
				money: '',
				companyId: -1,
				company_name: '',
				branchList: [],
				stock: '',
				real_name: '',
				id_card_number: ''
			}
		},
		methods: {
			// 查询可分配股权
			queryStock(){
				if(this.companyId==-1) return this.$api.msg('请先选择分公司');
				this.$axios('RegionalService/getFreeStock','POST','regional',{
						companyId: this.companyId
					}).then(res=>{
					if(res.data.code == 200){
						uni.showModal({
							title: '可分配股权',
							content: '目前剩余可分配股权为'+res.data.data.freeStock+'%',
							showCancel: false,
							confirmText: '好的'
						});
					}
				})
			},
			// 查询分公司
			queryBranch(){
				if(!this.company_name) return this.$api.msg('请输入分公司名称进行查询');
				this.$axios('RegionalService/queryCompany','POST','regional',{
						company_name: this.company_name
					}).then(res=>{
					if(res.data.code == 200){
						this.branchList = res.data.data.list;
						if(res.data.data.list.length==0){
							this.$api.msg('没有查找到相关分公司');
						}
					}
				})
			},
			// 查询会员
			queryMember(){
				if(!this.money) return this.$api.msg('请输入缴纳金额');
				if(this.companyId==-1) return this.$api.msg('请选择分公司');
				if(!this.memberId) return this.$api.msg('请输入会员ID');
				this.info = [];
				this.$axios('RegionalService/prepare','POST','regional',{
						memberId: this.memberId,
						money: this.money,
						companyId: this.companyId
					}).then(res=>{
					if(res.data.code == 200){
						this.info = res.data.data;
					}
				})
			},
			submit(){
				if(!this.money) return this.$api.msg('请输入缴纳金额');
				if(this.companyId==-1) return this.$api.msg('请选择分公司');
				if(!this.memberId) return this.$api.msg('请输入会员ID');
				// if(!this.stock) return this.$api.msg('请输入持股比例');
				// if(!this.real_name) return this.$api.msg('请输入真实姓名');
				// if(!this.id_card_number) return this.$api.msg('请输入身份证号');
				if(this.info.memberInfo&&this.info.memberInfo.avatar){
					uni.showModal({
						title: '提示',
						content: '请确认信息',
						success: res=> {
							if (res.confirm) {
								this.$axios('RegionalService/submit','POST','regional',{
									memberId: this.memberId,
									money: this.money,
									companyId: this.companyId,
									stock_percent: this.stock,
									real_name: this.real_name,
									id_card_number: this.id_card_number
								}).then(res=>{
									if(res.data.code == 200){
										this.$api.msg(res.data.data);
										setTimeout(()=>{
											this.$navTo('/pages/userservice/regionList');
										},1000)
									}
								})
							}
						}
					});
				}else{
					return this.$api.msg('请先查询会员信息');
				}
			},
			//选择分公司
			selectBranch(id){
				if(this.companyId==id){
					this.companyId = -1;
					return;
				}
				this.companyId = id;
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #FBF8FE;
		padding-bottom: 120rpx;
	}
	.wp{
		padding: 20rpx;
		padding-bottom: 100rpx;
	}
	.s_input{
		background: #FFFFFF;
		border-radius: 12rpx;
		display: flex;
		justify-content: space-between;
		height: 100rpx;
		align-items: center;
		padding: 0 30rpx;
		margin-top: 20rpx;
		input{
			flex: 1;
		}
		.s_query{
			width: 104rpx;
			line-height: 54rpx;
			background: #8615E1;
			border-radius: 27rpx;
			color: #FFFFFF;
			font-weight: 600;
			text-align: center;
		}
	}
	.uni-data-tree{
		background: #fff;
		margin-top: 20rpx;
	}
	.query_result{
		.q_tit{
			text-align: center;
			color: #999999;
			margin: 40rpx auto 20rpx;
		}
		.q_content{
			padding: 10rpx 30rpx;
			background: #FFFFFF;
			border-radius: 12rpx;
			margin-bottom: 20rpx;
			.q_info{
				flex: 1;
				line-height: 40rpx;
			}
			image{
				width: 120rpx;
				height: 120rpx;
				margin-right: 20rpx;
				border-radius: 50%;
			}
		}
		.q_head{
			margin-bottom: 10rpx;
			margin-top: 20rpx;
			color: #666;
		}
		.q_branch{
			font-size: 26rpx;
			border: 2rpx solid transparent;
			padding: 10rpx 20rpx;
			.q_head{
				margin-top: 0;
			}
			.q_info{
				line-height: 40rpx;
			}
			.flex_between{
				image{
					border-radius: 8rpx;
				}
			}
		}
		.q_content_ac{
			position: relative;
			border: 2rpx solid $bg-color;
			.q_select{
				width: 60rpx;
				height: 60rpx;
				position: absolute;
				right: 0;
				top: 0;
				border-radius: 0;
				margin-right: 0;
			}
		}
	}
	.s_tip{
		margin-bottom: 20rpx;
		font-size: 30rpx;
		font-weight: 600;
		color: #8615E1;
		justify-content: center;
		height: 80rpx;
	}
	.s_href{
		color: #8615E1;
	    font-size: 30rpx;
	    font-weight: 600;
		text-align: right;
	}
</style>
